const app = getApp();
const api = require('../../../ws_micro_shop/utils/api.js');
const { throttle } = require('../../common/utils/util.js');

Page({
  data: {
    clueList: [],
    allClose: false,
    popverIndex: '',
    abnorData: {
      imgSrc: app.imgUrl + 'abnor-15.png',
      text: '暂时没有客户',
    },
    canPullUp: true,
    page: 1,
    isData: false,
  },

  onLoad() {
    this.setData({
      isData: false,
    }, () => {
      this.getClueList();
    });
  },

  getClueList() {
    let { page, clueList, last_id } = this.data;

    wx.showLoading({
      title: '正在加载...',
      mask: true,
    });
    app.ws_micro_shoprequest({
      url: api.staff.clue_list,
      data: {
        page,
        last_id: last_id ? last_id : ''
      },
      success: res => {
        if (res && res.code === 0 && res.data) {
          const newClueList = res.data;
          if (newClueList.length <= 0) {
            this.setData({
              canPullUp: false,
              isData: true,
            });
            return;
          }

          clueList = [...clueList, ...newClueList];
          this.setData({
            clueList,
            isData: true,
            last_id: res.last_id || ''
          });
        }
      },
      complete: res => {
        wx.hideLoading();
      },
    });
  },

  togglePopover(e) {
    const { clueList, allClose, popverIndex } = this.data;

    clueList.map((item, index) => {
      allClose ? (item.isShow = false) : index === popverIndex ? (item.isShow = true) : (item.isShow = false);
    });

    this.setData({
      clueList,
    });
  },

  handleEditStatus({ customer_id, status }) {
    let { clueList } = this.data;
    const currentIndex = clueList.findIndex(item => Number(item.id) === Number(customer_id));

    Number(status) === 1 ? (clueList[currentIndex].status = 1) : clueList.splice(currentIndex, 1);

    app.ws_micro_shoprequest({
      url: api.staff.clue_edit,
      data: {
        customer_id,
        status,
      },
      success: res => {
        if (res && res.code === 0) {
          wx.showToast({
            title: '操作成功',
            icon: 'success',
            complete: res => {
              this.setData({
                clueList,
              });
            },
          });
        } else {
          wx.showToast({
            title: '操作失败',
            icon: 'none',
          });
        }
      },
      fail: res => {
        wx.showToast({
          title: '操作失败',
          icon: 'none',
        });
      },
    });
  },

  onOperate(e) {
    const {
      item: { id: customer_id = '' },
      type,
    } = e.currentTarget.dataset;
    const status = type === 'followup' ? 1 : 2;
    const title = type === 'followup' ? '确认该会员线索已跟进' : '忽略该会员线索不再跟进';

    this.handleCloseAll();
    wx.showModal({
      title,
      confirmColor: '#4185f4',
      confirmText: '确认',
      success: result => {
        if (result.confirm) {
          this.handleEditStatus({ customer_id, status });
        }
      }
    });
  },

  onMore(e) {
    const { index: popverIndex = '' } = e.currentTarget.dataset;
    this.setData(
      {
        allClose: false,
        popverIndex,
      },
      () => {
        this.togglePopover();
      },
    );
  },

  handleCloseAll() {
    this.setData(
      {
        allClose: true,
      },
      () => {
        this.togglePopover();
      },
    );
  },

  onNavigate(e) {
    const { url, ...params } = e.currentTarget.dataset;
    url && app.util.navigateTo(url, params);
  },

  onReachBottom() {
    let { canPullUp, page } = this.data;

    if (canPullUp) {
      this.setData({
        page: ++page,
      });
      this.getClueList();
    }
  },
});
